<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>所有订单</title>
    <script src="js/jquery-3.6.3.min.js"></script>
    <link rel="stylesheet" href="css/bootstrap.css">
    <link rel="stylesheet" href="css/bootstrap-theme.css">
    <script src="js/bootstrap.js"></script>
    <script>
        $(function (){

            let pages = 1
            let current = 0
            let orders = null

            function setBtn(){
                $(".btnGoods").each(function () {
                    $(this).click(
                        function () {
                            $.ajax({
                                url: "/goods/details",
                                type: "post",
                                data: JSON.stringify({
                                    "id": $(this).attr("value")
                                }),
                                contentType: "application/json",
                                dataType: "json",
                                success: function (data) {
                                    let r = data;
                                    if(r.code===1){
                                        window.localStorage.setItem("goods", JSON.stringify(r.data))
                                        window.location.href = "/front/goodsDetail.html"
                                    }
                                    else{
                                        alert(r.msg)
                                    }
                                }
                            })
                        }
                    )
                })
                $(".btnPay").each(function (){
                    $(this).click(function (){
                        $("#orderId").val($(this).attr("value"))
                        $("#pay").submit()
                    })
                })
                $(".btnRemove").each(function (){
                    $(this).click(function (){
                        $.ajax({
                            url: "/order/remove",
                            type: "post",
                            data: JSON.stringify({
                                "id": $(this).attr("value")
                            }),
                            contentType: "application/json",
                            dataType: "json",
                            success: function (data) {
                                let r = data;
                                if(r.code===1){
                                    getPage(1)
                                    alert(r.data)
                                }
                                else{
                                    alert(r.msg)
                                }
                            }
                        })
                    })
                })
                $(".btnErr").each(function (){
                    $(this).click(function (){
                        $.ajax({
                            url: "/order/error",
                            type: "post",
                            data: JSON.stringify({
                                "id": $(this).attr("value")
                            }),
                            contentType: "application/json",
                            dataType: "json",
                            success: function (data) {
                                let r = data;
                                if(r.code===1){
                                    getPage(1)
                                    alert(r.data)
                                }
                                else{
                                    alert(r.msg)
                                }
                            }
                        })
                    })
                })
            }

            function getPage(pageNum){

                if(pageNum<=0||pageNum>pages){
                    return
                }

                let table = $("#orderTable")
                table.empty()
                orders = null

                $.ajax({
                        url: "/order/page",
                        type: "post",
                        data: JSON.stringify({
                            "pageNum": pageNum,
                        }),
                        contentType: "application/json",
                        dataType: "json",
                        success: function (data) {
                            let r = data;
                            if (r.code === 1) {

                                pages = r.data.pages
                                $("#pageNum").attr("max", pages)

                                current = r.data.current
                                if(pages<=0){
                                    current=0
                                }

                                $("#pageNum").val(current)


                                orders = r.data.records
                                if(current<=1){
                                    $("#btnLast").parent("li").addClass("disabled")
                                }
                                else{
                                    $("#btnLast").parent("li").removeClass("disabled")
                                }

                                if(current>=pages){
                                    $("#btnNext").parent("li").addClass("disabled")
                                }
                                else{
                                    $("#btnNext").parent("li").removeClass("disabled")
                                }

                                for (let i = 0; i < orders.length; i++) {
                                    let order = orders[i]
                                    let stat = "未付款"
                                    if(order.stat == 1){
                                        stat = "未发货"
                                    }
                                    else if(order.stat==2){
                                        stat = "已完成"
                                    }
                                    else if(order.stat==3){
                                        stat = "申诉中"
                                    }

                                    table.append(
                                        "<tr>"+
                                        "<td>" +
                                        "<button class='btnGoods btn-link' value='" + order.goodsid + "'>" + order.name +
                                        "</button>" +
                                        "</td>"+
                                        "<td><label>" + (order.price/100.0)*order.count+ "元<label/></td>"+
                                        "<td><label>" + order.count+ "件<label/></td>"+
                                        "<td><label>" + order.address+ "<label/></td>"+
                                        "<td><label>" + order.email+ "<label/></td>"+
                                        "<td><label>" + stat + "<label/></td>"+
                                        "<td>" +
                                        "<button class='btnPay btn-primary' value='" + order.id + "'>付款</button>" +
                                        "<button class='btnRemove btn-danger' value='" + order.id + "'>移除</button>" +
                                        "<button class='btnErr btn-info' value='" + order.id + "'>申诉</button>" +
                                        "</td>"+
                                        "</tr>"
                                    )
                                }

                                setBtn()

                                $("#labelPage").text("     共 "+pages+" 页，当前第 "+current+" 页，跳转到")
                            } else {
                                alert(r.msg)
                            }
                        }
                    }
                )
            }

            $("#btnLast").click(
                function (){
                    getPage(current-1)
                }
            )

            $("#btnNext").click(
                function (){
                    getPage(current+1)
                }
            )

            $("#btnPage").click(
                function (){
                    getPage($("#pageNum").val())
                }
            )

            getPage(1)

            $("input").attr("autocomplete", "off")
        })
    </script>
</head>
<body>
    <form id="pay" action="/order/goAlipay" hidden>
        <input id="orderId" type="hidden" name="orderId">
    </form>
    <div id="orderBox" class="table-responsive">
        <div class="page-header">
            <h3>
                所有订单
            </h3>
        </div>
        <table class="table table-bordered table-striped">
            <thead>
            <tr>
                <td>商品名</td>
                <td>总价</td>
                <td>个数</td>
                <td>收货地址</td>
                <td>邮箱</td>
                <td>状态</td>
                <td>操作</td>
            </tr>
            </thead>
            <tbody id="orderTable">

            </tbody>
        </table>
        <nav aria-label="Page navigation">
            <ul class="pagination" id="orderPage">
                <li>
                    <a aria-label="Previous" id="btnLast">
                        <span aria-hidden="true">&laquo;</span>
                    </a>
                </li>
                <li>
                    <a aria-label="Next" id="btnNext">
                        <span aria-hidden="true">&raquo;</span>
                    </a>
                </li>
                <li style="display: inline">
                    <label for="pageNum" id="labelPage"></label>
                    <input type="number" id="pageNum" min="0" max="1" value="1">
                    <button type="button" class="btn btn-primary btn-xs" id="btnPage">跳转</button>
                </li>
            </ul>
        </nav>
    </div>

</body>
</html>